<script setup lang="ts">
import { useRouter } from 'vue-router';
import { Copyright } from "@vben/icons"
import { ElMessage } from 'element-plus';

defineOptions({ name: "Footer" })
const router = useRouter();
type btnType = {
  name: string,
  type: string
}
const btns = [
  // { name: '联系我们', type: 'contactUs' },
  { name: '法律声明', type: 'legalDisclaimer' },
  { name: '隐私政策', type: 'privacyPolicy' },
  { name: '证书查询', type: 'certVerify' },
]

const toDo = (item: btnType) => {
  if (item?.type === 'certVerify') router.push("/auth/certVerify")
}

</script>
<template>
  <div class="footer h-[48px] bg-[#DEE0EB] flex items-center justify-center text-[#595959] text-[14px]">
    技术支持
    <Copyright class="w-[15px]"></Copyright>
    <p>深圳市深思造物科技有限公司</p>
    <el-divider direction="vertical" class="divider" />
    <el-popover class="box-item" content="+8613266209471" placement="top-start">
      <template #reference>
        <el-button link class="btns">联系我们</el-button>
      </template>
    </el-popover>
    <el-button link v-for="item in btns" class="btns" @click="toDo(item)">{{ item.name }}</el-button>
  </div>
</template>
<style lang="less" scoped>
.btns {
  @apply text-[#595959] font-normal;
}
.divider {
  border: 1px solid #a8abb2;
  width: 1px;
  height: 35%;
}
</style>
